<template>
	<view class="c-row-box">
		<view class="c-row-head">
			<view class="c-row-title">尾款{{ exchangeType == 1 ? '收款' : '付款' }}</view>
		</view>
		<view class="c-row-item">
			<view class="c-row c-row-list">
				<view class="c-row-col c-row-col-list-item">
					<view class="col-title">
						<text style="color: red;">*</text>
						{{ exchangeType == 1 ? '收款' : '付款' }}金额
					</view>
					<view class="col-text"><input type="digit" placeholder="请输入" @input="getMiddleMoney" v-model="hotelProtocol.tail_money" :disabled="isPreview" /></view>
				</view>
			</view>
			<view class="c-row c-row-list">
				<view class="c-row-col c-row-col-list-item">
					<view class="col-title">
						<text style="color: red;">*</text>
						{{ exchangeType == 1 ? '收款' : '付款' }}时间
					</view>
					<view class="col-text">
						<picker mode="date" :start="startDate" :end="endDate" @change="tailDateChange" :disabled="isPreview">
							<view>{{ hotelProtocol.tail_money_date == '' ? '请选择' : hotelProtocol.tail_money_date }}</view>
						</picker>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	props: {
		exchangeType: {
			type: Number,
			default() {
				// 1:代表收款;2:代表付款
				return 1;
			}
		},
		isPreview: {
			type: Boolean,
			default() {
				return false;
			}
		},
		hotelProtocol: {
			type: Object,
			default() {
				return {};
			}
		},
		startDate: {
			type: String,
			default() {
				return '';
			}
		},
		endDate: {
			type: String,
			default() {
				return '';
			}
		}
	},
	data() {
		return {};
	},
	methods: {
		tailDateChange(e) {
			this.hotelProtocol.tail_money_date = e.target.value;
		},
		// 获取中款
		getMiddleMoney() {
			this.$emit('getMiddleMoney');
		}
	}
};
</script>

<style lang="less">
@import url('../../../order/createOrder/components/common.less');
@import url('../../../order/components/common.less');
</style>
